<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script src="../static/js/jquery-3.4.0.min.js"></script>
		<script src="../static/js/popper.min.js"></script>
		<link rel="stylesheet" href="../static/css/bootstrap.rfs.min.css">
		<script src="../static/js/bootstrap.min.js"></script>
		<link rel="stylesheet" href="../static/css/bootstrap-switch.min.css" />
		<script src="../static/js/bootstrap-switch.min-3.3.4.js"></script>
		<link rel="stylesheet" href="../static/css/bootstrap-select.min.css" />
		<script src="../static/js/bootstrap-select.min.js"></script>
		<link rel="stylesheet" href="../static/css/fontawesome.all.min.css" />
		<link rel="stylesheet" href="../static/css/aniGamerPlus.css" />
		<script src="../static/js/settings_id_list.js"></script>
		<script src="../static/js/aniGamerPlus.js"></script>
		<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0" />
		<link rel="shortcut icon" href="../static/img/aniGamerPlus.ico" type="image/x-icon" />
		<title>aniGamerPlus控制臺</title>
	</head>
	<body>
		<nav class="navbar navbar-expand-md bg-dark navbar-dark fixed-top">
			<a class="navbar-brand" href="#">aniGamerPlus控制臺</a>

			<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
				<span class="navbar-toggler-icon"></span>
			</button>
			<div class="collapse navbar-collapse" id="collapsibleNavbar">
				<ul class="navbar-nav">
					<li class="nav-item my-navbar">
						<a class="nav-link" href="#">自動模式設定</a>
					</li>
					<li class="nav-item my-navbar">
						<a class="nav-link" href="./monitor">任務監控中心</a>
					</li>
					<li class="nav-item my-navbar">
						<a class="nav-link" href="#" data-toggle="modal" data-target="#snList">sn_list</a>
					</li>
					<li class="nav-item my-navbar">
						<button class="btn btn-success" type="button" data-toggle="modal" data-target="#manualTasks">添加手動任務</button>
					</li>
				</ul>
			</div>
		</nav>

		<!-- 手动模式模态框 -->
		<div class="modal fade" id="manualTasks">
			<div class="modal-dialog modal-lg">
				<div class="modal-content">
					<!-- 模态框头部 -->
					<div class="modal-header">
						<h4 class="modal-title">手動添加任務</h4>
						<button type="button" class="close" data-dismiss="modal">&times;</button>
					</div>
					<!-- 模态框主体 -->
					<div class="modal-body setting-wrapper">
						<form>
							<div class="row setting-content setting-content">
								<div class="input-group">
									<div class="input-group-prepend">
										<span class="input-group-text">影片鏈接</span>
									</div>
									<input id="manual_link" type="text" class="form-control input-group-prepend-form-control" />
								</div>
							</div>

							<!-- <div class="row"> -->

							<div class="row input-group setting-content">
								<div class="input-group-prepend ">
									<span class="input-group-text">下載模式　　　</span>
									<select id="manual_mode" class="selectpicker show-tick form-control" data-style="btn-gray" data-header="選擇下載模式">
										<option data-subtext="本集">single</option>
										<option data-subtext="最後一集">latest</option>
										<option data-subtext="全部劇集">all</option>
										<option data-subtext="最近上傳">largest-sn</option>
									</select>
								</div>
							</div>

							<div class="input-group row setting-content">
								<div class="input-group-prepend ">
									<span class="input-group-text">下載解析度　　</span>
									<select id="manual_resolution" class="selectpicker show-tick form-control" data-style="btn-gray" data-header="選擇解析度">
										<option>1080P</option>
										<option>720P</option>
										<option>540P</option>
										<option>480P</option>
										<option>360P</option>
									</select>
								</div>
							</div>

							<div class="row input-group setting-content">
								<div class="input-group-prepend">
									<span class="input-group-text">建立番劇資料夾</span>
									<input id="manual_classify" type="checkbox" data-toggle="switch" data-on-color="success" 　data-size="normal"
									 checked />
								</div>
							</div>

							<div class="row input-group setting-content">
								<div class="input-group-prepend">
									<span class="input-group-text">下載彈幕　　　</span>
									<input id="manual_danmu" type="checkbox" data-toggle="switch" data-on-color="success" 　data-size="normal" />
								</div>
							</div>

							<div class="row input-group setting-content" style="max-width: 15rem;">
								<div class="input-group-prepend">
									<span class="input-group-text">最大并發下載數</span>
								</div>
								<input id="manual_thread_limit" type="number" min="1" step="1" class="form-control input-group-prepend-form-control"
								 placeholder="正整數" />
							</div>



						</form>
					</div>
					<!-- 模态框底部 -->
					<div class="modal-footer">
						<button type="button" class="btn btn-success" onclick="readManualConfig()">提交</button>
						<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
					</div>
				</div>
			</div>
		</div>

		<!-- sn_list 模态框 -->
		<div class="modal fade" id="snList">
			<div class="modal-dialog modal-lg">
				<div class="modal-content">

					<!-- 模态框头部 -->
					<div class="modal-header">
						<h4 class="modal-title">sn_list</h4>
						<button type="button" class="close" data-dismiss="modal">&times;</button>
					</div>

					<!-- 模态框主体 -->
					<div class="modal-body setting-wrapper">
						<dl>
							<dt>格式：</dt>
							<dd><code>
									@分類(可空)<br>
									sn碼 下載模式(可空) 	&lt;重命名&gt;(可空) #注釋(可空)
								</code></dd>

							<dt>説明</dt>
							<dd>注釋 <kbd>#</kbd> 後面的所有字符程序均不會讀取, 可以用於標記番劇名</dd>
							<dd>在一排番劇列表的上方 <kbd>@</kbd> 開頭後面的字符將會作爲番劇的分類名, 番劇會歸類在此分類名的資料夾下</dd>
							<dd>若單獨 <kbd>@</kbd> 表示不分類</dd>
							<dd>用 <kbd>&lt;</kbd> 與 <kbd>&gt;</kbd> 將自定義的番劇名框起來, 下載時將會使用這個名字作爲番劇目錄名</dd>
						</dl>

						<form>
							<div class="input-group mb-3 input-group-lg">
								<textarea class="form-control" rows="5" id="sn_list"></textarea>
							</div>
						</form>
						
					</div>

					<!-- 模态框底部 -->
					<div class="modal-footer">
						<button type="button" class="btn btn-success" onclick="postSnList()">提交</button>
						<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
					</div>

				</div>
			</div>
		</div>


		<!-- 提交请求模态框 -->
		<div class="modal fade" id="uploadStatus">
			<div class="modal-dialog modal-sm" role="document">
				<div class="modal-content">

					<!-- 模态框头部 -->
					<div class="modal-header">
						<h4 class="modal-title">提交結果</h4>
						<button type="button" class="close" data-dismiss="modal">&times;</button>
					</div>

					<!-- 模态框主体 -->
					<div class="modal-body setting-wrapper">
						<center>
							<div id="uploadOk" style="display: none;">
								<i class="far fa-check-circle fa-4x" style="color: #28A745;"></i>
								<p class="upload-status">配置已成功提交</p>
							</div>

							<div id="uploadFailed" style="display: block;">
								<i class="fas fa-exclamation-circle fa-4x" style="color: #DC3545;"></i>
								<p class="upload-status">配置提交失敗</p>
							</div>


						</center>

					</div>

					<!-- 模态框底部 -->
					<div class="modal-footer">
						<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
					</div>

				</div>
			</div>
		</div>

		<!-- 自动模式配置界面主体 -->
		<div class="setting-wrapper mx-auto" style="padding-top: 70px;">
			<form>
				<div class="row">
					<h2 class="col">路徑設定</h2>
				</div>
				<div class="row setting-content">
					<div class="input-group">
						<div class="input-group-prepend">
							<span class="input-group-text">下載目錄</span>
						</div>
						<input id="bangumi_dir" type="text" class="form-control input-group-prepend-form-control" placeholder="放空則存放於程式所在資料夾" />
					</div>
				</div>
				<div class="row setting-content ">
					<div class="input-group">
						<div class="input-group-prepend">
							<span class="input-group-text">暫存目錄</span>
						</div>
						<input id="temp_dir" type="text" class="form-control input-group-prepend-form-control" placeholder="放空則存放於程式所在資料夾" />
					</div>
				</div>

				<div class="row">
					<h2 class="col">下載設定</h2>
				</div>
				<div class="row setting-content">
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">建立番劇資料夾</span>
							<input id="classify_bangumi" type="checkbox" data-toggle="switch" data-on-color="success" 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">鎖定解析度　　</span>
							<input id="lock_resolution" type="checkbox" data-toggle="switch" data-on-color="success" 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">分段下載模式　</span>
							<input id="segment_download_mode" type="checkbox" data-toggle="switch" data-on-color="success" 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">檔名添加番劇名</span>
							<input id="add_bangumi_name_to_video_filename" type="checkbox" data-toggle="switch" data-on-color="success"
							 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">檔名添加解析度</span>
							<input id="add_resolution_to_video_filename" type="checkbox" data-toggle="switch" data-on-color="success"
							 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">模擬手機端解析</span>
							<input id="use_mobile_api" type="checkbox" data-toggle="switch" data-on-color="success" 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">下載彈幕　　　</span>
							<input id="danmu" type="checkbox" data-toggle="switch" data-on-color="success" 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">下載解析度　　</span>
							<select id="download_resolution" class="selectpicker show-tick form-control" data-style="btn-gray" data-header="選擇解析度">
								<option>1080P</option>
								<option>720P</option>
								<option>540P</option>
								<option>480P</option>
								<option>360P</option>
							</select>
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">默認下載模式　</span>
							<select id="default_download_mode" class="selectpicker show-tick form-control" data-style="btn-gray" data-header="選擇下載模式">
								<option data-subtext="最後一集">latest</option>
								<option data-subtext="全部劇集">all</option>
								<option data-subtext="最近上傳">largest-sn</option>
							</select>
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">更新間隔　　　</span>
						</div>
						<input id="check_frequency" type="number" min="1" step="1" class="form-control input-group-prepend-form-control"
						 placeholder="單位分鐘" />
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">最大并發下載數</span>
						</div>
						<input id="multi-thread" type="number" min="1" step="1" class="form-control input-group-prepend-form-control"
						 placeholder="正整數" />
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">最大并發分段數</span>
						</div>
						<input id="multi_downloading_segment" type="number" min="1" step="1" class="form-control input-group-prepend-form-control"
						 placeholder="正整數" />
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">影片檔名前綴　</span>
						</div>
						<input id="customized_video_filename_prefix" type="text" class="form-control input-group-prepend-form-control" />
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">影片檔名後綴　</span>
						</div>
						<input id="customized_video_filename_suffix" type="text" class="form-control input-group-prepend-form-control" />
					</div>
					<div class="input-group col-md-12 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">請求UA　　　　</span>
						</div>
						<input id="ua" type="text" class="form-control input-group-prepend-form-control" placeholder="若有使用cookie請與取得cookie的瀏覽器保持一致" />
						<button type="button" class="btn btn-dark" onclick="getUA()">取得當前UA</button>
					</div>
				</div>

				<div class="row">
					<h2 class="col">代理設定</h2>
				</div>
				<div class="row setting-content">
					<div class="input-group col-md-12 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">代理總開關</span>
							<input id="use_proxy" type="checkbox" data-toggle="switch" data-on-color="success" 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">選擇協議　</span>
							<select id="proxy_protocol" class="selectpicker show-tick form-control" data-style="btn-gray" data-header="選擇協議">
								<option>SOCKS5</option>
								<option>SOCKS5H</option>
								<option>HTTP</option>
								<option>HTTPS</option>
							</select>
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">伺服器IP</span>
						</div>
						<input id="proxy_ip" type="text" class="form-control input-group-prepend-form-control" placeholder="127.0.0.1" />
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">Port</span>
						</div>
						<input id="proxy_port" type="text" class="form-control input-group-prepend-form-control" placeholder="1080" />
					</div>
					<div class="input-group col-md-6 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">用戶名</span>
						</div>
						<input id="proxy_user" type="text" class="form-control input-group-prepend-form-control" placeholder="沒有放空即可" />
					</div>
					<div class="input-group col-md-6 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">密碼</span>
						</div>
						<input id="proxy_passwd" type="password" class="form-control input-group-prepend-form-control" placeholder="沒有放空即可"
						 autocomplete />
					</div>
				</div>

				<div class="row">
					<h2 class="col">其他</h2>
				</div>
				<div class="row setting-content">
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">啓動時檢查更新</span>
							<input id="check_latest_version" type="checkbox" data-toggle="switch" data-on-color="success" 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">每次檢查讀取sn_list</span>
							<input id="read_sn_list_when_checking_update" type="checkbox" data-toggle="switch" data-on-color="success"
							 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">每次檢查讀取配置</span>
							<input id="read_config_when_checking_update" type="checkbox" data-toggle="switch" data-on-color="success"
							 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">記錄日志</span>
							<input id="save_logs" type="checkbox" data-toggle="switch" data-on-color="success" 　data-size="normal" />
						</div>
					</div>
					<div class="input-group col-md-4 my-button">
						<div class="input-group-prepend">
							<span class="input-group-text">日志數量</span>
						</div>
						<input id="quantity_of_logs" type="number" min="1" step="1" class="form-control input-group-prepend-form-control"
						 placeholder="正整數, 每天一個日志" />
					</div>
				</div>
				<br /><br />
				<center>
					<button type="button" class="btn btn-success" onclick="readSettings()">保存</button>
					<button type="button" class="btn btn-danger" onclick="reloadSetting()">重載配置</button>
				</center>

			</form>
		</div>

		<script>
			$('[data-toggle="switch"]').bootstrapSwitch();
		</script>
	</body>
</html>
